<template>
	<a-modal :title="title" :width="1400" :visible="visible" :confirmLoading="confirmLoading" @ok="handleSubmit"
		@cancel="handleCancel" :okText="'确认出库'" :footer="disabled ? null : undefined">
		<a-card :bordered="false">
			<div class="table-page-search-wrapper">
				<a-form layout="inline">
					<a-row :gutter="48">
						<a-col :md="12" :sm="24">
							<a-form-item label="出库单号">
								<a-input v-model="queryParam.ckOrderNumber" placeholder="请输入出库单号" />
							</a-form-item>
						</a-col>
						<a-col :md="12" :sm="24">
							<a-form-item label="备注">
								<a-textarea v-model="queryParam.remark" placeholder="请输入备注" />
							</a-form-item>
						</a-col>
						<a-col :md="9" :sm="24">
							<a-form-item label="物料料号">
								<a-input v-model="queryParam.materialCode" placeholder="请输入物料料号" />
							</a-form-item>
						</a-col>
						<a-col :md="9" :sm="24">
							<a-form-item label="物料名称">
								<a-input v-model="queryParam.materialName" placeholder="请输入物料名称" />
							</a-form-item>
						</a-col>
						<a-col :md="6" :sm="24">
							<a-col :md="24" :sm="24">
								<a-button type="primary" @click="getlist(emsOrder)">查询</a-button>
								<a-button style="margin-left: 8px" @click="() => { queryParam = {}; getlist(emsOrder) }">重置</a-button>
							</a-col>
						</a-col>
					</a-row>
				</a-form>
			</div>

			<a-table ref="table" size="default" :columns="columns" :data-source="filteredData" :alert="true"
				:rowKey="(record) => record.code" :showPagination="false">
				<span slot="image" slot-scope="text,record">
					<image-preview1 :images="text" :imageUrl="record.material.imageUrl" />
				</span>

				<span slot="customNormalNumber" slot-scope="text,record">
					<a-input-number v-model="record.customNormalNumber" :min="0"
						:disabled="record.number - record.completedNumber == 0" :max="(record.number - record.completedNumber)"
						style="width: 67px;" />
				</span>
			</a-table>
		</a-card>
	</a-modal>
</template>

<script>
import { STable } from '@/components'
import { page as emsOrderMaterialManagePage } from '@/api/modular/main/emsordermaterial/emsOrderMaterialManage'

import {
	addOutOrderForCGDJGOrder
} from "@/api/modular/main/subcontractOrder/waitoutOrder"

export default {
	components: {
		STable,
	},

	data() {
		return {
			title: null,
			disabled: false,
			queryParam: {},  // 查询参数
			filteredData: [],
			form: this.$form.createForm(this),
			visible: false,
			confirmLoading: false,
			columns: [],
		}
	},
	computed: {

	},
	methods: {
		init(record, extra) {
			this.visible = true
			this.emsOrder = record;
			this.title = "去出库"
			this.disabled = false;
			this.columns = [
				{
					title: '序号', width: '80px',
					align: 'center',
					customRender: (text, record, index) => `${index + 1}`,
				},
				{
					title: '料号',
					dataIndex: 'materialCode'
				},
				{
					title: '物料名称',
					dataIndex: 'materialName'
				},
				{
					title: '规格',
					dataIndex: 'materialModelNumber',
					scopedSlots: { customRender: 'materialModelNumber' }
				},
				{
					title: '图片',
					dataIndex: 'image',
					scopedSlots: { customRender: 'image' }
				},
				{
					title: '实时库存',
					dataIndex: 'material.inventoryNumber',
				},
				{
					title: '需出库数量',
					dataIndex: 'number',
				},
				{
					title: '已出库数量',
					dataIndex: 'completedNumber',
				},
				{
					title: '待出库数量',
					dataIndex: '',
					customRender: (text, record, index) => record.number - record.completedNumber > 0 ? record.number - record.completedNumber : 0,
				},
				{
					title: '出库数量',
					dataIndex: 'customNormalNumber',
					scopedSlots: { customRender: 'customNormalNumber' }
				},
			];
			this.getlist(record);
		},
		getlist(record) {
			emsOrderMaterialManagePage({
				...this.queryParam,
				pageSize: -1,
				materialType: this.$util.getUrlParam(this.$route.path).materialType,
				orderId: record.orderId,
				filterType: 1,
			}).then(res => {
				console.log(res);
				this.filteredData = res.data.rows.map(val => {
					return {
						...val,
					}
				});
				console.log("this.filteredData---", this.filteredData);

			})
		},
		handleSubmit() {
			const { form: { validateFields } } = this

			let that = this;

			validateFields((errors, values) => {
				if (!errors) {


					let list = that.filteredData.filter(val => val.customNormalNumber == 0 || !val.customNormalNumber);
					console.log(length);
					if (list.length == that.filteredData.length) {
						that.$emit("ok");
						that.visible = false;
						that.handleCancel()
						return
					}
					// return
					that.$confirm({
						title: '系统提示',
						content: '是否确认出库？',
						onOk: () => {
							// that.confirmLoading = true;
							let orderMaterials = that.filteredData.map(value => {
								return Object.assign({}, value, {
									sourceOrderId: that.emsOrder.orderId,
									sourceOrderMaterialId: value.orderMaterialId,
									number: value.customNormalNumber ? value.customNormalNumber : 0,
								})
							})
							orderMaterials = orderMaterials.filter(val => val.number && val.number != 0);
							console.log(orderMaterials);
							// return
							let orderBean = {
								orderId: '',
								sourceOrderId: that.emsOrder.orderId,
								orderParentId: '',
								orderPids: '',
								orderNumber: '',
								orderType: that.$businessEnum.ORDER_TYPE_ENUM.outOrder.id,
								orgId: '',
								targetOrgId: '',
								isOverseasStore: '',
								countryCode: '',
								file: '',
								remark: '',
								executeStatus: '',
								executeProgress: '',
								issueTime: '',
								estimateCompletionTime: '',
								receiveTime: '',
								status: '',
								createTime: '',
								createUser: '',
								updateTime: '',
								updateUser: '',
								orderMaterials: orderMaterials,
							}
							console.log(orderBean);
							addOutOrderForCGDJGOrder(orderBean).then(res => {
								if (res.success) {
									that.$message.success('出库成功')
									that.$emit("ok");
									that.handleCancel()
								} else {
									that.$message.error('出库失败：' + res.message)
								}
							}).finally(() => {
								that.confirmLoading = false;
								that.visible = false;
							})

						},
						onCancel() {
							that.confirmLoading = false;
							that.visible = false;
							console.log('Cancel');
						},
					});


				} else {
					that.confirmLoading = false
				}
			})

		},
		handleCancel() {
			this.visible = false
		},
	}
}
</script>

<style lang="less">
.table-operator {
	margin-bottom: 18px;
}
</style>
